<template>
    <div class="table">
        <el-table
            border
            empty-text="当前数据空空如也"
            ref="multipleTable"
            :data="dataList"
            tooltip-effect="dark"
            style="width: 100%"
            @select="selectedRow"
            @select-all="selectedAll"
        >
            <el-table-column type="selection" width="55"></el-table-column>
            <el-table-column prop="id" label="ID" width="100"></el-table-column>
            <el-table-column prop="order_no" label="订单号" width="auto"></el-table-column>
            <el-table-column prop="order_price" label="订单金额" width="auto"></el-table-column>
            <el-table-column prop="amount" label="质保金" width="auto"></el-table-column>
            <el-table-column prop="status" label="状态" width="auto">
                <template slot-scope="scope">
                    <div>{{scope.row.status==0?'未扣除':scope.row.status==1?'已扣除':''}}</div>
                </template>
            </el-table-column>
        </el-table>
        <div class="page-nav">
            <el-pagination
            background
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="page"
            :page-sizes="[10, 20, 30, 50, 100]"
            :page-size="pagesize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total">
            </el-pagination>
        </div>
    </div>
</template>
<script>
export default {
    data(){
        return{
            page:1,
            pagesize:10,
            total:0,
            dataList:[]
        }
    },
    methods: {
        // 获取质保金明细
        getEarnList(){
            let params = {
                page:this.page,
                pagesize:this.pagesize
            }
            this.$http.post('/api/admin/Wallet/earnestamountlist',params).then(res=>{
                console.log(res,'质保金明细');
                if(res.code==1){
                    this.dataList = res.data[0].list?res.data[0].list:[]
                }
            })
        },
        
        handleSizeChange(val) {
            this.pagesize = val;
            this.page = 1;
            this.getEarnList()
        },
        handleCurrentChange(val) {
            this.page = val;
            this.getEarnList()
        },

        selectedRow(){

        },
        selectedAll(){

        }

    },
}
</script>
<style lang="less">
.table{
    background-color: #fff;
    padding: 20px;
    .table-content{
      min-height: 70%;
      height: auto;
      margin: 20px 0px 0 0px;
      padding:10px;
      background-color: #fff;
    
      .table-bar{
        margin-bottom: 10px;
      }
  
    }
    .page-nav{
        padding: 10px;
    
        .el-pagination{
            text-align: right;
        }
    }

}
</style>
